<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogFormVisibleUserPwd"
      :close-on-click-modal="false"
      @close="handleCloseUserModifyClose"
    >
      <el-form
        ref="ruleFormUserPwd"
        :model="ruleFormUserPwd"
        :rules="rulesUserPwd"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="新密码" prop="sysUserPwd">
          <el-input v-model="ruleFormUserPwd.sysUserPwd" type="password" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" :loading="editPwdLoading" @click="submitFormUserModify('ruleFormUserPwd')">提交</el-button>
          <el-button @click="resetFormUserModify('ruleFormUserPwd')">重置</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { sysUserPwd } from '@/api/momo/SysEnterprise'
import { success } from '@/utils/tip'

export default {
  name: 'UserPwd',
  props: {
    userPwdChild: {}
  },
  data() {
    return {
      editPwdLoading: false,
      title: '',
      dialogFormVisibleUserPwd: false,
      ruleFormUserPwd: {
        uuid: '',
        sysUserPwd: ''
      },
      editLoading: {
        loading: false,
        uuid: ''
      },
      rulesUserPwd: {
        sysUserPwd: [
          { required: true, message: '密码必填', trigger: 'blur' }
        ]
      }
    }
  },
  watch: {
    userPwdChild: {
      deep: true,
      immediate: false,
      handler() {
        this.dialogFormVisibleUserPwd = true
        this.ruleFormUserPwd = JSON.parse(JSON.stringify(this.userPwdChild))
        this.title = '正在为用户 [' + this.ruleFormUserPwd.sysUserName + ' ]修改密码'
      }
    }
  },
  methods: {
    submitFormUserModify(formName) {
      this.$refs[formName].validate((valid) => {
        this.editPwdLoading = true
        if (valid) {
          sysUserPwd(this.ruleFormUserPwd).then(res => {
            res = res.data
            this.dialogFormVisibleUserPwd = false
            success(res)
            this.editPwdLoading = false
            this.resetFormUserModify('ruleFormUserPwd')
            this.$emit('userPwdToFather', '我是孩子')
          }).catch(errored => {
            this.editPwdLoading = false
          })
        } else {
          this.editPwdLoading = false
          console.log('error submit!!')
          return false
        }
      })
    },
    resetFormUserModify(formName) {
      this.$refs[formName].resetFields()
    },
    handleCloseUserModify() {
      // this.dialogFormVisibleUserPwd = false
      // this.$emit('userModifyToFather', '我是孩子')
    },
    handleCloseUserModifyClose() {
      this.dialogFormVisibleUserPwd = false
      // this.$emit('userModifyToFather', '我是孩子')
    }
  }
}
</script>

<style scoped>

</style>
